import GameBoard from "./GameBoard";
import {use, useState} from "react";


const imageList = [
    "https://images.unsplash.com/photo-1626808642875-0aa545482dfb",
    "https://images.unsplash.com/photo-1546842931-886c185b4c8c",
    "https://images.unsplash.com/photo-1520763185298-1b434c919102",
    "https://images.unsplash.com/photo-1442458017215-285b83f65851",
    "https://images.unsplash.com/photo-1496483648148-47c686dc86a8",
    "https://images.unsplash.com/photo-1591181520189-abcb0735c65d",
];

const {picStatusList, setPicStatusList} = useState(new Array(imageList.length * 2).fill(false));

export default function App() {
    return (
        <>
            <h1 className={"text-6xl underline text-center"}>Memory Game</h1>
            <div className="container mx-auto">
                <GameBoard images={imageList}  picStatusList={picStatusList} />
            </div>

        </>
    )
}